<template>
	<div>
		<!-- 购物车的数据类型’；数组 -->
		<table border="1">
			<thead>
				<th>全选<input v-model="isActive" type="checkbox" /></th>
				<th>名称</th>
				<th>数量</th>
				<th>单价</th>
				<th>金额</th>
				<th>操作</th>
			</thead>
			<tbody>
				<tr v-for="item in list" :key="item.name">
					<td><input v-model="item.checked" type="checkbox" /></td>
					<td>{{ item.name }}</td>
					<td><el-input-number v-model="item.count"></el-input-number></td>
					<td>{{ item.money }}</td>
					<td>
						<button></button>
					</td>
				</tr>
			</tbody>
			<tfoot>
				<tr>
					<td colspan="3">
						<button :disabled="isActive">删除所选项</button>
					</td>
					<td colspan="3">
						总价格{{ 100 }}
						<button>去支付</button>
					</td>
				</tr>
			</tfoot>
		</table>
	</div>
</template>

<script>
export default {
	computed: {
		totals() {
			return this.list.reduce((sum, item) => {})
		},
		isActive() {
			//对list里的checked做判断
			//只要有一个checked为true
			return this.list.some((item) => item.checked)
		},
		set(bool) {},
	},
	data() {
		return {
			list: [
				{ checked: false, name: '手机', count: 1, money: 2000 },
				{ checked: false, name: '平板', count: 1, money: 3500 },
				{ checked: false, name: '笔记本', count: 2, money: 6800 },
				{ checked: false, name: '房子', count: 1, money: 1000000 },
			],
		}
	},
}
</script>
0
<style>
</style>
